<template>
  <view class="activity-box">
    <view class="activity_header" :style="{'z-index':headerZindex}">
      <view class='cart_nav'>
        <nav-bar navTitle="秒杀列表" iconColor='#fff' :backgroundColor="backgroundColor"
                 :isBackgroundColor="false"></nav-bar>
      </view>
    </view>
    <view class="list-box" :style="{'z-index':listZindex}">
      <seckill-list :seckillList="seckillList" :loading="loading" :loadTitle="loadTitle"
                    :status="1"></seckill-list>
    </view>
  </view>
</template>

<script>
import navBar from '@/components/navBar';
import useActivity from "@/mixins/useActivity";
import SeckillList from "../components/SeckillList";
import {
  seckillMerchantApi
} from "../../../api/activity";

export default {
  mixins: [useActivity],
  name: "index",
  components: {
    navBar,
    SeckillList
  },
  data() {
    return {
      seckillList: [],
      page: 1,
      limit: 10,
      loading: false,
      loadend: false,
      merId: 0,
      loadTitle: '',
    }
  },
  onLoad(options) {
    this.merId = options.merId
    this.getSeckillList()
  },
  // 滚动监听
  onPageScroll(e) {
    // 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
    uni.$emit('scroll');
  },
  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    this.getSeckillList();
  },
  methods: {
    getSeckillList() {
      let data = {
        page: this.page,
        limit: this.limit,
        merId: this.merId,
      };
      if (this.loadend) return;
      if (this.loading) return;
      this.loadTitle = '';
      this.loading = true
      seckillMerchantApi(data).then(res => {
        this.$set(this, 'page', this.page + 1);
        this.seckillList = this.seckillList.concat(res.data.list || []);
        this.loadend = this.page > res.data.totalPage;
        this.loadTitle = this.loadend ? '已全部加载' : '加载更多';
        this.loading = false;
        this.showSkeleton = false
      }).catch(err => {
        this.loading = false
      });
    },
  }
}
</script>

<style scoped lang="scss">
@import "../static/css/activity.scss";

.activity_header {
  background-image: url();
}

::v-deep .seckill_list {
  padding: 0 !important;
  background-color: #f5f5f5 !important;
}

::v-deep .seckill_item {
  border: none;
}
</style>